/**index.wxss**/
page {
  height: 100vh;
  background-color: #efefef !important;
  padding: 16rpx;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;

  >view {
    &:nth-child(n+2) {
      margin-top: 16rpx;
    }
  }
}

// 轮播图样式
.swiper {
  border-radius: 10rpx;

  swiper {
    height: 360rpx;
    background-color: skyblue;

    image {
      width: 100%;
      height: 100%;
    }

    // swiper-item{
    //   // &在sass中代表的是父选择器，引用的意思
    //   // swiper-item:first-child
    //   &:first-child{
    //     background-color: lightcoral;
    //   }
    //   &:last-child{
    //     background-color: lightseagreen;
    //   }
    // }
  }
}

// 公司信息
.info {
  display: flex;
  justify-content: space-between;
  background-color: #fff;
  padding: 20rpx 16rpx;
  border-radius: 10rpx;
}

// 商品导航
.good-nav {
  display: flex;
  justify-content: space-between;
  background-color: #fff;
  padding: 20rpx 16rpx;
  border-radius: 16rpx;

  view {
    display: flex;
    flex-direction: column;
    align-items: center;

    navigator {
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    image {
      width: 80rpx;
      height: 80rpx;
    }

    text {
      font-size: 24rpx;
      margin-top: 12rpx;
    }
  }
}

// 推荐商品区域
.good-hot {
  background-color: #fff;
  padding: 16rpx;
  border-radius: 10rpx;
  font-size: 24rpx;

  .scroll-x {
    width: 100%;
    white-space: nowrap;

    view {
      display: inline-block;
      width: 320rpx;
      height: 440rpx;
margin-right: 16rpx;
      .good-item{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text{
          &:nth-of-type(1){
            font-weight: bold;
          }
        }
      }
      image {
        width: 100%;
        height: 320rpx;
      }

      &:last-child{
        margin-right: 0;
      }
    }
  }
}



// 滚动栏
// .scroll-x {
//   width: 100%;
//   white-space: nowrap;
//   background-color: skyblue;

//   view {
//     display: inline-block;
//     width: 300rpx;
//     height: 80rpx;

//     &:last-child {
//       background-color: lightcoral;
//     }

//     &:first-child {
//       background-color: lightgreen;
//     }
//   }
// }

// .scroll-y {
//   height: 400rpx;
//   ;
//   margin-top: 10rpx;
//   background-color: skyblue;

//   view {
//     height: 400rpx;

//     &:last-child {
//       background-color: lightcoral;
//     }

//     &:first-child {
//       background-color: lightgreen;
//     }
//   }
// }